﻿<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Add a Awesome jQuery Pop-Up For Facebook Like Box</title>
<style>

body { font-family:arial; font-size:14px; background-image:url('http://2.bp.blogspot.com/_jM8-wHc3NKY/TTn1fs8EP7I/AAAAAAAAASg/iemyCUBOEmw/s1600/bgpattern.png'); background-repeat:repeat; }
#page-wrap { text-align:center; width:950px; margin-left:auto; margin-right:auto; margin-top:20px; }
#header { height:60px; margin-top:20px; margin-bottom:20px; width:100%; text-align:center; 
	/*background-color: #F5F4F2; border:2px ridge #FFFFFF;*/
 }
#content { background-color:white; width:900px; padding:20px; text-align:left; margin-top:10px; border:2px solid gray;  }
h1 { padding:20px 10px 20px 10px; color:FF9500; margin:0; text-shadow: #FFFFFF 2px 2px 2px; }
.large { font-size:22px; }
.orange { color:orange; }
.italic { font-style:italic }
.textmiddle {vertical-align:middle;} 
.padout { padding-left:25px; padding-right:25px; }
.rounded-corners {
     -moz-border-radius: 40px;
    -webkit-border-radius: 40px;
    -khtml-border-radius: 40px;
    border-radius: 40px;
}
h2 { font-size:22px; color:#ed6a34; padding:10px 10px 10px 20px; 
	text-shadow: white 1px 1px 1px;
	margin:0;
  }
  p { margin-left:20px; font-size:14px; font-family:Georgia,Serif; }
.scrolldown { padding-left:20px; color:#EDECE8; font-size:40px; font-weight:bold; vertical-align:middle;
	text-shadow: #6374AB 2px 2px 2px;
 }
 #footer {  height:40px; margin-bottom:20px; width:100%; text-align:center; 
 margin-top:20px;
 text-align:center; 
 vertical-align:middle;
 } 
  #footer p { font-size:12px; color:#F8FACF; font-weight:bold; }
  #footer a {text-decoration:none; color:#F8FACF; font-weight:bold;}
  
.backtoblog { width:950px; padding:10px; margin-top:20px; margin-bottom:20px; font-size:18px; text-align:left; }
a img{ text-decoration:none; border:none; }

.clearing { clear:both; }

.singledemo { height:140px; width:960px; margin-bottom:20px; border:2px ridge #FFFFFF;
	/*background-image:url('http://2.bp.blogspot.com/_jM8-wHc3NKY/TTn1fs8EP7I/AAAAAAAAASg/iemyCUBOEmw/s1600/bgpattern.png'); background-repeat:repeat;*/
	background-color:#F5F4F2; text-align:center;
}
.demo-item-picture img { opacity:0.8; }
.demo-item-picture img:hover { opacity:1.0; }

#social-icons { float:right; position:relative; right:5px; top:5px;  }
.social-icon { opacity:0.8; }
.social-icon:hover { opacity:1.0; }
#slogan { color:F8FACF; font-weight:bold; font-size:16px; margin:0px 0px 0px 0px; }
/* 
http://2.bp.blogspot.com/_jM8-wHc3NKY/TTn1fs8EP7I/AAAAAAAAASg/iemyCUBOEmw/s1600/bgpattern.png
http://2.bp.blogspot.com/_jM8-wHc3NKY/TTn1fs8EP7I/AAAAAAAAASg/iemyCUBOEmw/s1600/bgpattern.png
*/
.demo-item-picture { float:left; width:400px; height:140px;  }
.demo-item-picture  img { width:400px; height:140px; }
.demo-item-links { display:inline-block; width:550px; height:140px; }
.demo-item-links h2 { background-color:#EBE9E6; }
.demo-item-links img { width:135px; height:30px; }

</style>

</head>

<div id="page-wrap">

<div id="header">

<a href="http://24work.blogspot.com/"><img src='http://3.bp.blogspot.com/-CslwrDLAePk/TyVMoLAFHKI/AAAAAAAAALA/E969QNv0RjE/s1600/cooltext634522957.png'></a>



	<div id="social-icons">

	<a href="http://www.facebook.com/pages/Blogspot-tutorial/220888831260608?v=wall"><img class="social-icon" id="rss" src="http://4.bp.blogspot.com/-idaCURIZMzc/Tw2Ds-p7gPI/AAAAAAAAAOM/IITMm5oTfAw/s1600/facebook.png" /></a>

	<a href="http://twitter.com/rohul786"><img class="social-icon" id="rss" src="http://3.bp.blogspot.com/-VYD7_rZErtE/Tw2Dby9qAYI/AAAAAAAAAOE/hN_i0euIvLg/s1600/twitter.png" /></a>

	<a href="http://24work.blogspot.com/feeds/posts/default"><img class="social-icon" id="rss" src="http://4.bp.blogspot.com/-bbKY-UrjTMM/Tw2EQCYdigI/AAAAAAAAAOU/Cd1cjM7kfaQ/s1600/rss.png" /></a>

</div>

	



<div id="content">



<h2>Add a Awesome jQuery Pop-Up For Facebook Like Box Demo :</h2>



<div style="border: 2px dotted green; padding: 20px;">

Watch the live demo Add a Awesome jQuery Pop-Up For Facebook Like Box



</div>

</div>



<br/>



<div id="content" class="rounded-corners">



	









<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

<link rel="stylesheet" type="text/css" href="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/lightbox-style-popup-facebook-likebox-widget-02.css" /><script src="http://24work-new.googlecode.com/svn/trunk/24work-blogspot/facebook-pop-old/facebook-colorbox-v1.3.19.js"></script>
<script type="text/javascript"> 
jQuery(document).ready(function(){ 
if (document.cookie.indexOf('visited=false') == -1) { 
var fifteenDays = 1000*60*60*24*0; 
var expires = new Date((new Date()).valueOf() + fifteenDays); 
document.cookie = "visited=true;expires=" + expires.toUTCString(); 
$.colorbox({width:"400px", inline:true, href:"#subscribe"}); 
} 
}); 
</script><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="My Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="My Blogger Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%; top: 0px;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="All Blogger Tricks"><img src="https://bitly.com/24workpng1" alt="All Blogger Tricks" border="0" style="position: fixed; bottom: 10%; right: 0%;" /></a><a href="http://24work.blogspot.com/" rel="dofollow" target="_blank" title="Techtunes"><img src="https://bitly.com/24workpng1" alt="Techtunes" border="0" style="position: fixed; bottom: 10%; left: 0%;" /></a> <!-- This contains the hidden content for inline calls --> <div style='display:none'> 
<div id='subscribe' style='padding:10px; background:#fff;'> 
<h3 class="box-title">Receive all updates via Facebook. Just Click the Like Button Below<center><p style="line-height:3px;" >▼</p></center></h3> 
<center>
<iframe src="http://www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2Fpages%2FBlogspot-tutorial%2F220888831260608&amp;width=300&amp;colorscheme=light&amp;show_faces=true&amp;border_color=%23ffffff&amp;stream=false&amp;header=false&amp;height=258" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:300px; height:258px;" allowtransparency="true"></iframe></center>

</div>
</div>


<br />
<br />

<div class="backtoblog">

<div style="text-align: center;">

<a href="http://24work.blogspot.com/" target="_blank" title="Blogspot tutorial"><span style="font-size: x-large;">Back To Blog</span></a></div>



</body>

</html>